<template>
  <u-tabbar
    id="tab"
    :value="activeIndex"
    @change="change1"
    :fixed="false"
    :placeholder="false"
    :safeAreaInsetBottom="false"
    activeColor="#0099FF"
    inactiveColor="#333333"
  >
    <u-tabbar-item
      v-for="(item, index) in tabList"
      :key="index"
      :text="item.title"
      :icon="
        activeIndex == index
          ? `/static/tabbar-icons/${item.icon}_s.png`
          : `/static/tabbar-icons/${item.icon}.png`
      "
      @click="click1"
    >
    </u-tabbar-item>
  </u-tabbar>
</template>
    
<script>
export default {
  props: ["activeIndex"],
  data() {
    return {
      value1: 0,
      tabList: [
        { title: "首页", icon: "index", url: "/pages/index/index" },
        { title: "会议", icon: "meeting", url: "/pages/meeting/meeting" },
        { title: "信息", icon: "message", url: "/pages/message/message" },
        // { title: "日常", icon: "daily", url: "/pages/daily/daily" },
        { title: "系统", icon: "user", url: "/pages/user/user" },
      ],
    };
  },
  methods: {
    change1(e) {
      if (this.activeIndex != e) {
        uni.navigateTo({ url: this.tabList[e].url });
      }
    },
    click1(e) {
      console.log("click1", e, this.value1);
    },
  },
};
</script>

<style lang="scss">
@import "@/static/css/_px2vw.scss";
.u-tabbar__content__item-wrapper {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  flex-direction: column;
  justify-content: space-between;
  height: 100%;
  width: vw(120);
}
</style>
